<template>
  <div class="chat-tap">
    <circle-img class="chat-tap-avatar" :src=user.avatar />
    <span class="chat-tap-info">
      <div class="chat-tap-info-name">{{user.name}}</div>
      <div>{{user.account}}</div>
    </span>
  </div>
</template>

<script>
import CircleImg from '../common/CircleImg'

export default {
  name: 'ChatTab',
  components: {
    CircleImg
  },
  props: {
    user: Object
  }
}
</script>

<style lang="stylus" scoped>
.chat-tap-avatar {
  width: 70px;
  height: 70px;
  vertical-align: middle;
  display: inline-block;
}

.chat-tap-info {
  padding-top: 20px;
  padding-left: 10px;
  display: inline-block;
  vertical-align: middle;

  .chat-tap-info-name {
    margin: 0 0 10px 3px;
  }
}
</style>
